import { ref } from "../vue.esm-browser.js";
// 链接数据库
import PocketBase from "../pocketbase.es.js";
const pb = new PocketBase("http://127.0.0.1:8090");

const html = String.raw;
export default {
  setup() {
    const usersList = ref([]); //保存用户列表
    async function getUsersList() {
      let filter = "";

      const resultList = await pb.collection("users").getList(1, 50, {
        filter,
      });
      usersList.value = resultList.items;
    }

    getUsersList();

    return { usersList };
  },

  template: html` <table class="table">
    <thead>
      <tr>
        <th>用户名</th>
        <th>邮箱</th>
        <th>手机</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="{username,email,phone} in usersList">
        <td>{{username}}</td>
        <td>{{email}}</td>
        <td>{{phone}}</td>
      </tr>
    </tbody>
  </table>`,
};
